import React, { useState, useEffect, useRef } from "react";
import { Form, Button, Input, Affix, Select, message, Space, Switch, Drawer, Row, Col, Modal } from "antd";
import cmdbres from "@/data/cmdbres";
import request, {requestIAM} from '@/utils/request';
import regexpUtil from "@/utils/regexpUtil";
import hcpUtils from "@/utils/hcpUtils";

const user = hcpUtils.getUser();
const {filterArray} = hcpUtils;
const CreateModelAssociateType = ({ history, visible, setVisible, onCreateFinish, info }) => {
    const tip = (info && info.id) ? "编辑": "新建";
    const [loading, setLoading] = useState(false);
	const [form] = Form.useForm();

    useEffect(() => {
        if(visible) {
            if(info && info.id) {
                form.setFieldsValue({
                    ...info
                 })
            }
        }
    }, [visible]);

	const onFinish = async (fieldsValue) => {
        setLoading(true);
        const url = (info && info.id) ? cmdbres.updateAssociateType(info.id) : cmdbres.createAssociateType;
		let res = await request({
			...url,
			data: {
                ...fieldsValue,
                id: (info && info.id) ? info.id : undefined,
                author: user.staffName
            }
		});
		setLoading(false);
		if (res && res.code == 200) {
			setVisible(false);
			message.success(`${tip}关联类型成功！`);
			if (typeof onCreateFinish == "function") onCreateFinish(res);
		}
	};

    const handleClose = () => {
        setVisible(false);
    }

    return (
        <Modal 
            title={`${tip}关联类型`}
            className="hcp-modal-md"
            onCancel={handleClose}
            visible={visible}
            footer={null}
            destroyOnClose
            afterClose={() => {
                form.resetFields();
            }}
        >
            <Form
                form={form}
                labelCol={{ span: 5}}
                wrapperCol={{ span: 17 }}
                name="basic"
                onFinish={onFinish}
            >
                <Form.Item 
                    label="关系类型名称"
                    name="name"
                    rules={[{required: true,message: '请输入名称'}]}
                >
                    <Input placeholder="请输入名称" maxLength={20}/>
                </Form.Item>
                <Form.Item 
                    label="唯一标识" 
                    name="associateTypeCode" 
                    rules={[{required: true,message: '请输入英文标识'}]}
                >
                    <Input placeholder="请输入英文标识" maxLength={64} disabled={info&&info.id}/>
                </Form.Item>
                 <Form.Item 
                    label="源->目标描述"
                    name="srcToDestDesc"
                    rules={[{required: true,message: '请输入关联描述'}]}
                >
                    <Input placeholder="请输入关联描述如：上联" maxLength={256}/>
                </Form.Item>
                 <Form.Item 
                    label="目标->源描述"
                    name="destToSrcDesc"
                    rules={[{required: true,message: '请输入关联描述'}]}
                >
                    <Input placeholder="请输入关联描述如：上联" maxLength={256}/>
                </Form.Item>
                <div className="hcp-modal-body-footer">
                    <Form.Item wrapperCol={{ span: 24 }}>
                        <Button onClick={handleClose}>取消</Button>
                        <Button type="primary" htmlType="submit" loading={loading}>确定</Button>
                    </Form.Item>
                </div>
            </Form>
        </Modal>
    );
};

export default CreateModelAssociateType;
